<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{
				margin: 0;
				padding: 0;
				border: none;
			}
			body ,html{
				width: 100%;
				height: 100%;
				background: url(images/bg.jpg) no-repeat center;
				background-size: cover;
			}
			img{
				width: 18px;
				height: 18px;
				position: absolute;
			}
			
		</style>
		<!--<script type="text/javascript" src="move_new.js" ></script>-->
		<script type="text/javascript" src="move_new2.js" ></script>
		<script type="text/javascript">
			/**
			 * 萤火虫：
			 * 构造函数+原型
			 * 构造函数：添加属性ele
			 * 原型：添加方法：fly（）
			 * 添加方法randowPoint（）
			 */
			//萤火虫类（构造函数）
			function FireWorm(){
				//属性
				this.ele = document.createElement("img");
				this.ele.src = "images/1.jpg";//图片
				//随机位置
				this.ele.style.left = this.randomPoint().left + "px";
				this.ele.style.top  = this.randomPoint().top + "px";
				
				document.body.appendChild(this.ele);//添加到屏幕上
			}
			//方法：放在原型中
			//飞
			FireWorm.prototype.fly = function(){
				var self = this;//保存this给self
				animate(this.ele,this.randomPoint(),{callBack:function(){
					//这里是运动完成后会调用
					self.fly();
				}});
			}
			
			//生成随机点
			FireWorm.prototype.randomPoint = function(){
				var x = parseInt(Math.random()*document.documentElement.clientWidth);
				var y = parseInt(Math.random()*document.documentElement.clientHeight);
				return {left:x,top:y};
			}
			
			onload = function(){
				var count = 10;
				var timer = setInterval(function(){
					if(count--){
						//创建一个萤火虫
						var fireWorm = new FireWorm();
						fireWorm.fly();//飞
					}else{
						clearInterval(timer);
					}
				},1000);

//		//创建一个萤火虫
//						var fireWorm = new FireWorm();
//						fireWorm.fly();//飞
			}
		</script>
	</head>
	<body>
	</body>
</html>
